<template>
	<view>
		我的
		<view v-if="userInfo.nickName">
			<image :src="userInfo.headImgUrl" mode="" style="width: 100rpx; height: 100rpx;"></image>
			<view>{{userInfo.nickName}}</view>
		</view>
		<view v-else>
			<navigator  url="/user/Login/Login">登录</navigator>
		</view>
		<view @click="logout">退出</view>
		<navigator url="/pages/orderpay/orderpay">支付</navigator>
		<button type="primary" size="mini" @click="shareSys">分享-系统分享</button>
		<button type="primary" size="mini" @click="shareSession">分享-微信聊天</button>
		<button type="primary" size="mini" @click="shareTimeline">分享-朋友圈</button>
		<button type="warn" open-type="share">分享</button>
		<view>
			<image 
			@click="pre(pic)"
			:src="pic" mode="aspectFit" v-for="pic in list" :key="pic" class="img"></image>
			
		</view>
		 <button @click="upLoad">上传</button>
		 
		 <image :src="picurl" @click="downImg(picurl)" />
	</view>
</template>

<script setup>
 // 导入生命周期
 import {onShow,onShareAppMessage,onShareTimeline} from '@dcloudio/uni-app'
 // 导入ref引用
 import {ref}  from 'vue'
 // 导入检测登录接口
 import {CheckLogin} from '../../api/index.js'
 // 用户信息
 const userInfo = ref({})
 // 登录方法
 function login(){
	CheckLogin()
	.then(res=>{
		 if(res.code==200){
			 userInfo.value = res.data;
		 }
	}) 
 }
 // 页面显示就执行一次登录
 onShow(()=>{
	 // login()
 })
// 退出登录
 const logout = ()=>{
	 // 清空token
	uni.setStorageSync("token","");
	// 清空用户信息
	userInfo.value= {};
	// 跳转到登录
	uni.navigateTo({
		url:"/user/Login/Login"
	})
 }
 function shareSys(){
	uni.shareWithSystem({
		  summary: '分享给你100W机会\n限前50名',
		  href: 'https://uniapp.dcloud.io',
		  success(){
		    // 分享完成，请注意此时不一定是成功分享
			uni.showToast({
				title:"分享完成"
			})
		  },
		  fail(){
		    // 分享失败
			uni.showToast({
				title:"分享失败",
				icon:"error"
			})
		  }
	})
 }
 // 下面两种分享打包上线都需要分享appid，（去微信开放平台https://open.weixin.qq.com/）
 function shareSession(){
	 uni.share({
	 	provider: "weixin",
	 	scene: "WXSceneSession",
	 	type: 0,
	 	href: "http://uniapp.dcloud.io/",
	 	title: "uni-app分享",
	 	summary: "我正在使用HBuilderX开发uni-app，赶紧跟我一起来体验！",
	 	imageUrl: "https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/uni@2x.png",
	 	success: function (res) {
	 		console.log("success:" + JSON.stringify(res));
	 	},
	 	fail: function (err) {
	 		console.log("fail:" + JSON.stringify(err));
	 	}
	 });
 }
 
 function shareTimeline(){
	 uni.share({
	 	provider: "weixin",
	 	scene: "WXSceneTimeline",
	 	type: 0,
	 	href: "http://uniapp.dcloud.io/",
	 	title: "uni-app分享",
	 	summary: "我正在使用HBuilderX开发uni-app，赶紧跟我一起来体验 ！",
	 	imageUrl: "https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/uni@2x.png",
	 	success: function (res) {
	 		console.log("success:" + JSON.stringify(res));
	 	},
	 	fail: function (err) {
	 		console.log("fail:" + JSON.stringify(err));
	 	}
	 });
 }
 
 onShareAppMessage(()=>{
	 return {
	 title:"分享现金红包给你",
	 imageUrl:"https://img1.baidu.com/it/u=4141248613,2390372022&fm=253&fmt=auto&app=138&f=JPEG?w=569&h=353",
	 path:"/pages/user/user" 
 }
 })
 // onShareTimeline();
 // 准备图片列表
 const list = ref([
	 "https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/7bfda2a88bc0ce1f17b44cce285be2d4.jpg","https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/7277f0163a4041c882104ab6163252d7.jpeg","https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/309d66406483fd2da682e014cc772ef3.jpg"
 ])
 const picurl = ref("https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/7bfda2a88bc0ce1f17b44cce285be2d4.jpg")
 
 // 01 使用图片预览
 function pre(pic){
	 uni.previewImage({
	 	urls:list.value,
		current:pic
	 })
 }
 // 02 使用图片的上传
 
 function upLoad(){
	 // 01 选择图片
	 uni.chooseImage({
	 	count:1,
		success(res){
			console.log("选择的图片",res.tempFilePaths[0])
			// tempFilePaths
				uni.uploadFile({
					url: 'http://dida100.com:8888/api/file/upload', 
					filePath: res.tempFilePaths[0],
					name: 'file',					 
					success: (result) => {
						// 上传成功后把返回的字符串转换为json
						var file = JSON.parse(result.data).file;
						list.value.unshift('http://dida100.com:8888'+file.path)
						console.log(result.data);
						console.log(JSON.parse(result.data).file);
					}
				});
		}
	 })
 }
 // 03 图片的下载
 
 function downImg(url){
	 // #ifdef H5
	   var  a = document.createElement("a");
	   a.href = url;
	   a.download = 'image.jpg';
	   a.target="_blank";
	   document.body.appendChild(a);
	   a.click();
	  return;
	 // #endif
	 
	 // 获取图片信息
	 uni.getImageInfo({
	 	src:url,
		success(res){
			console.log(res,"图片信息")
			// 保存文件到相册
			uni.saveImageToPhotosAlbum({
				filePath:res.path,
				success(res){
					console.log("下载成功",res)
					uni.showToast({
						title:"下载成功"
					})
				}
			})
		}
	 })
 }
</script>
<style>
	.img{
		width: 400rpx;
		height: 240rpx;
	}
</style>

 
